import Vue from 'vue'
import main from './ie9-placeholder.vue'

var ie9placeholder = Vue.extend(main)

function insertAfter (newEl, targetEl) {
  var parentEl = targetEl.parentNode;
  if (parentEl.lastChild == targetEl) {
    parentEl.appendChild(newEl);
  } else {
    parentEl.insertBefore(newEl, targetEl.nextSibling);
  }
} 

Vue.directive('ie9placeholder', {
  bind (el, binding) {
  },
  inserted (el) {
    const placeholder = el.placeholder
    const ie9 = true
    if (ie9) {
      var myHodler = new ie9placeholder().$mount()
      myHodler.text = placeholder
      insertAfter(myHodler.$el, el)
      el.ie9p = myHodler
    }
  },
  update (el) {
    if (el.value.length === 0) {
      el.ie9p.visible = true
    } else {
      el.ie9p.visible = false
    }
  }
})